<template>
  <div class="app-container">
    <el-row :gutter="30">
      <el-col :span="12">
        <el-card class="box-card">
          <div slot="header" class="clearfix">
            <span>访客状态复位</span>
            <el-button style="float: right; padding: 3px 0" type="text" @click="doTest0">执行</el-button>
          </div>
          <div>
            <el-form ref="form0Ref" :model="form0" label-width="120px" label-position="right">
              <el-form-item label="身份证号" required>
                <el-input v-model="form0.cardNo" placeholder="身份证号" />
              </el-form-item>
            </el-form>
            <el-divider>结果</el-divider>
            <div>
              <el-form label-width="120px" label-position="right">
                <el-form-item label="code">
                  <span>{{result0.code}}</span>
                </el-form-item>
                <el-form-item label="msg">
                  <span>{{result0.msg}}</span>
                </el-form-item>
              </el-form>
            </div>
          </div>
        </el-card>
      </el-col>
      <el-col :span="12">
        <el-card class="box-card">
          <div slot="header" class="clearfix">
            <span>身份核验</span>
            <el-button style="float: right; padding: 3px 0" type="text" @click="doTest1">执行</el-button>
          </div>
          <div>
            <el-form ref="form1Ref" :model="form1" label-width="120px" label-position="right">
              <el-form-item label="身份证号" required>
                <el-input v-model="form1.idCardNo" placeholder="请输入身份证号" />
              </el-form-item>
              <el-form-item label="发卡机序列号" required>
                <el-input v-model="form1.devSn" placeholder="请输入序列号" />
              </el-form-item>
            </el-form>
            <el-divider>结果</el-divider>
            <div>
              <el-form label-width="120px" label-position="right">
                <el-form-item label="code">
                  <span>{{result1.code}}</span>
                </el-form-item>
                <el-form-item label="msg">
                  <span>{{result1.msg}}</span>
                </el-form-item>
                <el-form-item label="访客ID">
                  <span>{{result1.data.id}}</span>
                </el-form-item>
              </el-form>
            </div>
          </div>
        </el-card>
      </el-col>
      <el-col :span="12">
        <el-card class="box-card">
          <div slot="header" class="clearfix">
            <span>领卡</span>
            <el-button style="float: right; padding: 3px 0" type="text" @click="doTest2">执行</el-button>
          </div>
          <div>
            <el-form ref="form1Ref" :model="form2" label-width="120px" label-position="right">
              <el-form-item label="访客ID" required>
                <el-input v-model="form2.visitorId" placeholder="访客ID" />
              </el-form-item>
              <el-form-item label="访客卡号" required>
                <el-input v-model="form2.guestCardCode" placeholder="请输入访客卡号" />
              </el-form-item>
              <el-form-item label="发卡机序列号" required>
                <el-input v-model="form2.devSn" placeholder="请输入序列号" />
              </el-form-item>
            </el-form>
            <el-divider>结果</el-divider>
            <div>
              <el-form label-width="120px" label-position="right">
                <el-form-item label="code">
                  <span>{{result2.code}}</span>
                </el-form-item>
                <el-form-item label="msg">
                  <span>{{result2.msg}}</span>
                </el-form-item>
              </el-form>
            </div>
          </div>
        </el-card>
      </el-col>
      <el-col :span="12">
        <el-card class="box-card">
          <div slot="header" class="clearfix">
            <span>进门访客卡核验</span>
            <el-button style="float: right; padding: 3px 0" type="text" @click="doTest3">执行</el-button>
          </div>
          <div>
            <el-form ref="form1Ref" :model="form3" label-width="120px" label-position="right">
              <el-form-item label="访客卡号" required>
                <el-input v-model="form3.guestCardCode" placeholder="请输入访客卡号" />
              </el-form-item>
              <el-form-item label="验证机序列号" required>
                <el-input v-model="form3.devSn" placeholder="请输入序列号" />
              </el-form-item>
            </el-form>
            <el-divider>结果</el-divider>
            <div>
              <el-form label-width="120px" label-position="right">
                <el-form-item label="code">
                  <span>{{result3.code}}</span>
                </el-form-item>
                <el-form-item label="msg">
                  <span>{{result3.msg}}</span>
                </el-form-item>
                <el-form-item label="访客姓名">
                  <span>{{result3.data.name}}</span>
                </el-form-item>
              </el-form>
            </div>
          </div>
        </el-card>
      </el-col>
      <!--
      <el-col :span="12">
        <el-card class="box-card">
          <div slot="header" class="clearfix">
            <span>出门访客卡刷卡</span>
            <el-button style="float: right; padding: 3px 0" type="text" @click="doTest4">执行</el-button>
          </div>
          <div>
            <el-form ref="form1Ref" :model="form4" label-width="120px" label-position="right">
              <el-form-item label="访客卡号" required>
                <el-input v-model="form4.guestCardCode" placeholder="请输入访客卡号" />
              </el-form-item>
              <el-form-item label="发卡机序列号" required>
                <el-input v-model="form4.ipAddress" placeholder="请输入序列号" />
              </el-form-item>
            </el-form>
            <el-divider>结果</el-divider>
            <div>
              <el-form label-width="120px" label-position="right">
                <el-form-item label="code">
                  <span>{{result4.code}}</span>
                </el-form-item>
                <el-form-item label="msg">
                  <span>{{result4.msg}}</span>
                </el-form-item>
                <el-form-item label="访客姓名">
                  <span>{{result4.data.name}}</span>
                </el-form-item>
              </el-form>
            </div>
          </div>
        </el-card>
      </el-col>
      -->
      <el-col :span="12">
        <el-card class="box-card">
          <div slot="header" class="clearfix">
            <span>退还访客卡</span>
            <el-button style="float: right; padding: 3px 0" type="text" @click="doTest5">执行</el-button>
          </div>
          <div>
            <el-form ref="form1Ref" :model="form5" label-width="120px" label-position="right">
              <el-form-item label="访客卡号" required>
                <el-input v-model="form5.guestCardCode" placeholder="请输入访客卡号" />
              </el-form-item>
              <el-form-item label="发卡机序列号" required>
                <el-input v-model="form5.devSn" placeholder="请输入序列号" />
              </el-form-item>
            </el-form>
            <el-divider>结果</el-divider>
            <div>
              <el-form label-width="120px" label-position="right">
                <el-form-item label="code">
                  <span>{{result5.code}}</span>
                </el-form-item>
                <el-form-item label="msg">
                  <span>{{result5.msg}}</span>
                </el-form-item>
              </el-form>
            </div>
          </div>
        </el-card>
      </el-col>
    </el-row>
  </div>
</template>

<script>
  import {testIdCardCheck, testBindGuestCard, testEntryCheck, testExitCheck, testUnbindGuestCard, statusReset} from '@/api/test'
  export default {
    name: 'GuestTest',
    data() {
      return {
        form0: {
          cardNo: ''
        },
        result0: {
          code: 200,
          msg: ''
        },
        form1: {
          devSn: '9f51f2174bd2485e68',
          idCardNo: ''
        },
        result1: {
          code: 200,
          msg: '',
          data: {
            id: ''
          }
        },
        form2: {
          devSn: '9f51f2174bd2485e68',
          visitId: '',
          guestCardCode: 'E28068940000500B9D785479'
        },
        result2: {
          code: 200,
          msg: ''
        },
        form3: {
          devSn: '9f51f2174bd2485e68',
          guestCardCode: 'E28068940000500B9D785479'
        },
        result3: {
          code: 200,
          msg: '',
          data: {
            name: ''
          }
        },
        form4: {
          guestCardCode: 'E28068940000500B9D785479',
          ipAddress: ''
        },
        result4: {
          code: 200,
          msg: '',
          data: {
            name: ''
          }
        },
        form5: {
          devSn: '9f51f2174bd2485e68',
          guestCardCode: 'E28068940000500B9D785479'
        },
        result5: {
          code: '',
          msg: ''
        }
      }
    },
    mounted() {
    },
    methods: {
      // 身份证核验
      doTest0() {
        this.result0 = {
          code: 200,
          msg: ''
        }
        statusReset(this.form0.cardNo).then(response => {
          if (response.code === 200) {
            this.$message({
              message: '复位成功',
              type: 'success'
            })
          } else {
            this.$message.error("复位失败：" + response.msg)
          }
          this.result0.code = response.code
          this.result0.msg = response.msg
        })
      },
      // 身份证核验
      doTest1() {
        this.result1 = {
          code: 200,
          msg: '',
          data: {
            id: ''
          }
        }
        testIdCardCheck(this.form1.devSn, this.form1.idCardNo).then(response => {
          if (response.code === 200) {
            this.$message({
              message: '测试数据提交成功',
              type: 'success'
            })
            this.result1.data = response.data
            this.form2.visitorId = this.result1.data.id
            this.form2.devSn = '9f51f2174bd2485e68'
            this.form2.guestCardCode = 'E28068940000500B9D785479'
          } else {
            this.$message.error("提交失败：" + response.msg)
          }
          this.result1.code = response.code
          this.result1.msg = response.msg
        })
      },
      // 发卡
      doTest2() {
        this.result2 = {
          code: 200,
          msg: ''
        }
        testBindGuestCard(this.form2.devSn, this.form2.guestCardCode, this.form2.visitorId).then(response => {
          if (response.code === 200) {
            this.$message({
              message: '测试数据提交成功',
              type: 'success'
            })
            this.form3.guestCardCode = this.form2.guestCardCode
            this.form3.devSn = '9f51f2174bd2485e68'
          } else {
            this.$message.error("提交失败：" + response.msg)
          }
          this.result2.code = response.code
          this.result2.msg = response.msg
        })
      },
      // 入口核验
      doTest3() {
        this.result3 = {
          code: 200,
          msg: '',
          data: {
            name: ''
          }
        }
        testEntryCheck(this.form3.devSn, this.form3.guestCardCode).then(response => {
          if (response.code === 200) {
            this.$message({
              message: '测试数据提交成功',
              type: 'success'
            })
            this.result3.data = response.data
          } else {
            this.$message.error("提交失败：" + response.msg)
          }
          this.result3.code = response.code
          this.result3.msg = response.msg
        })
      },
      // 退卡
      doTest5() {
        this.result5 = {
          code: 200,
          msg: ''
        }
        testUnbindGuestCard(this.form5.devSn, this.form5.guestCardCode).then(response => {
          if (response.code === 200) {
            this.$message({
              message: '测试数据提交成功',
              type: 'success'
            })
          } else {
            this.$message.error("提交失败：" + response.msg)
          }
          this.result5.code = response.code
          this.result5.msg = response.msg
        })
      }
    }
  }
</script>
